<!DOCTYPE html>
<html lang="en">
	<head>
		<script src="https://d3js.org/d3.v4.min.js"></script>
	</head>
	<body>

		<ul id="list">
			<li></li>
			<li></li>
		</ul>

		<script>
			d3.selectAll("#list").selectAll("li").data([10, 20, 30, 25, 15]).text(function(d) {
				return "This is pre-existing element and the the value is " + d;
			}).enter().append("li").text(function(d) {
				return "This is dynamically created element and the value is " + d;
			})
		</script>
	</body>
</html>
